<template>
  <div>
    <el-table
          :data="content"
          style="width: 100%"
          max-height="700"
          :highlight-current-row="true"
          stripe>
          <el-table-column
            fixed
            width="50">
            <template slot-scope="scope">
            				      <el-radio :label="scope.row.id" v-model="selectRadio" @click.native.stop.prevent="getCurrentRow(scope.row)" style="color: #fff;padding-left: 10px; margin-right: -25px;">&nbsp;</el-radio>
            				    </template>
          </el-table-column>
          <el-table-column
            prop="primaryKey"
            label="应用名称"
            width="400">
          </el-table-column>
          <el-table-column
            prop="primaryValue"
            label="应用所在服务器IP"
            width="350">
          </el-table-column>
          <el-table-column
            prop="address"
            label="操作"
            width="500">
            <template slot-scope="scope">
                    <el-button
                      @click.native.prevent="oneKeyStop(scope.row)"
                      type="text"
                      size="small">
                      停用
                    </el-button>
                    <el-button
                      @click.native.prevent="oneKeyStart(scope.row)"
                      type="text"
                      size="small">
                      启用
                    </el-button>
                    <el-dialog
                      title="提示"
                      :visible.sync="dialogVisible"
                      :modal-append-to-body='false'
                      width="30%"
                      :before-close="handleClose">
                      <span v-model="message">{{message}}</span>
                      <span slot="footer" class="dialog-footer">
                          <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
                        </span>
                    </el-dialog>
                  </template>
          </el-table-column>
        </el-table>
  </div>
</template>
<script>
  export default {
      data() {
        return {
            totalPages: 0,
            page: 0,
            content: [],
            totalElements: 0,
            selectRadio: '',
            forbidden: true,
            //后端返回消息，弹框内message
            message : "",
            //弹框是否可见
            dialogVisible: false
        }
      },
      methods:{
        getListInfo:function(){
          this.$get(`admin/batchtask/getAppInfo`).then((r) => {
            this.content = r.data.content;
            this.totalPages = r.data.totalPages;
            this.page = r.data.page;
            this.totalElements = r.data.totalElements;
          })
        },
        oneKeyStop:function(scopeRow){
          let status = "0";
          this.$post(`admin/batchtask/setAppInfo`,{
            id : scopeRow.id,
            status : status
          }).then((response) =>{
            if (response.data.status === true) {
                   this.message = response.data.message;
                 } else {
                   this.message = response.data.message;
                 }
            this.dialogVisible = true;
          //   this.$alert(message, "", {
          //             confirmButtonText: '确定',
          //             callback: action => {
          //               this.$message({
          //                 type: 'info',
          //                 message: `action: ${ action }`
          //               });
          //             }
          //           });
           })
        },
        oneKeyStart:function(scopeRow){
          let status = "1";
          this.$post(`admin/batchtask/setAppInfo`,{
            id : scopeRow.id,
            status : status,
            }).then((response) =>{
            if (response.data.status === true) {
                   this.message = response.data.message;
                 } else {
                   this.message = response.data.message;
                 }
            this.dialogVisible = true;
          })
        },
        getCurrentRow (row) {
            if (!this.forbidden) {
              this.forbidden = true
            }
            if (this.selectRadio) {
              if (this.selectRadio === row.id) {
                this.selectRadio = ''
                this.forbidden = false
                setTimeout(() => {
                  this.forbidden = true
                }, 0)
                this.$emit('changeData', {}) // 取消勾选就把回传数据清除
                return
              } else {
                this.forbidden = false
                setTimeout(() => {
                  this.forbidden = true
                }, 0)
              }
            } else {
              this.forbidden = false
              setTimeout(() => {
                this.forbidden = true
              }, 0)
            }
            this.selectRadio = row.id
            this.$emit('changeData', row)
          }
      },
      mounted: function () {
        this.getListInfo()
      },
    }
</script>

